<template>
	<view class="search-list-wrap" v-if="!isEmpty">
		<scroll-view scroll-y class="search-list-scroll">
			<view class="search-list-items">
				<uni-list :border="false" >
					<!-- 分类 -->
					<uni-list-item
					v-for="(item) in searchData.categoryPlainInfos" 
					:key="item.categoryName" 
					:thumb="iconList[item.productType]" 		
					clickable
					showArrow 
					:ellipsis="1" 
					:border="true" 
					@click="$search_handleClick(item, Object.assign({keyword: ''}, options))"
					>
						<view slot="body">
							<rich-text class="rich_text floatLeft" :nodes="item.categoryName"></rich-text>
							<text class="rich_text floatLeft">
							{{item.productType === 1 ? '相关的线路产品' : '相关的门票产品'}}							
							</text>
						</view>
					</uni-list-item>
					<!-- 产品 -->
					<uni-list-item
						v-for="(item) in searchData.productPlainInfos" 
						:key="item.productCode" 		
						clickable
						showArrow 
						:ellipsis="1" 
						:border="true" 
						@click="$search_handleClick(item, Object.assign({keyword}, options))"
					>
						<view slot="body">
							<rich-text class="rich_text" :nodes="item.productName"></rich-text>
							<text v-if="item.redundancyMinPrice" class="rich_text">
							<basic-price :price="item.redundancyMinPrice" size="28rpx" unitSize="28rpx">起</basic-price>
							</text>
						</view>
					</uni-list-item>
				</uni-list> 				
			</view>			
		</scroll-view>
		<!-- 安全区 -->
		<basic-safe-area />
	</view>
</template>
<script>
import searchMixin from '@/mixins/search'
const tourImg = require('@/static/search-tour.png')
const ticketsImg = require('@/static/search-tickets.png')
export default {
	mixins: [searchMixin],
	props: {
		searchData: {
			type: Object,
			default: {
				categoryPlainInfos: [],
				productPlainInfos: []
			}
		},
		options: {
			type: Object,
			default: {}
		},
		keyword: {
			type: String,
			default: null
		},
		isEmpty: {
			type: Boolean,
			default: false
		}
	},
	data() {
		return {
			iconList:{ // 1：门票 3：线路
				'1': tourImg,
				'3': ticketsImg
			}
		}
	}
}
</script>
<style lang="less">
.search-list-wrap{
	height: 100%;
	.search-list-scroll{
		height: 100%;
		margin-bottom: 100rpx	
	}
	.uni-list{
		border-bottom: 1px solid #FAFAFA;
	}
	.search-list-items{
		padding-bottom: 800rpx;
	}
	.header-image{
		height: 24rpx;
		width: 24rpx;
		display: inline-block;
	}
	.header-text{
		display: inline-block;
	}	
	.floatLeft{
		float: left;
	}
}
</style>


